import { reactive, markRaw, computed } from 'vue'
import { removeUndefinedParams } from '@/utils/index'
import type { CTableProps } from '@/components/CTable'
import type { BasicPagingListParams } from '@/apis/basicModel'
import type { SearchOptionsType, TableFieldsSettingType } from '@/components/CPageTable'
import { ColumnSettingTypeEnum } from '@/components/CPageTable'
import { getBomProductList } from '@/apis/system/config/bomProduct'

export const useBom = () => {
  const searchForm = reactive({
    enterpriseName: undefined,
    productModelOrName: undefined
  })
  const searchOptions: SearchOptionsType[] = markRaw([
    // {
    //   name: '标准',
    //   field: 'standard',
    //   type: 'headerTab',
    //   headerTabList: [
    //     {
    //       label: '产品BOM集（整车）',
    //       value: 'ISO'
    //     },
    //     {
    //       label: '产品BOM集（零部件）',
    //       value: 'GB'
    //     }
    //   ]
    // },
    {
      name: '车型名称或车型公告号',
      placeholder: '车型名称或车型公告号',
      field: 'productModelOrName',
      type: 'input'
    },
    {
      name: '企业名称',
      placeholder: '企业名称',
      field: 'enterpriseName',
      type: 'input'
    }
  ])

  const productIdLabel = computed(() => {
    return window.GLOBAL_FIELD_TO_TEXT?.productId || '车型ID'
  })

  // 表格配置
  const tableOptions: CTableProps = {
    loadData
  }

  function loadData(parameter: BasicPagingListParams) {
    const params = Object.assign(handleParams(), parameter)
    return getBomProductList(params)
  }

  // 处理参数
  const handleParams = () => {
    // 参数
    let params = {
      enterpriseName: searchForm?.enterpriseName,
      productModelOrName: searchForm?.productModelOrName
    }
    params = removeUndefinedParams(params)
    return params
  }

  const tableFieldsSetting: TableFieldsSettingType[] = [
    {
      title: productIdLabel.value,
      field: 'productId',
      width: 120,
      columnSettingConfig: {
        enabled: true
      }
    },
    {
      title: '车型名称/车型公告号',
      field: 'productName',
      slot: 'productName',
      minWidth: 160,
      columnSettingConfig: {
        enabled: true
      }
    },

    {
      title: '车型描述',
      field: 'productDesc',
      minWidth: 150,
      columnSettingConfig: {
        enabled: true
      }
    },
    {
      title: '企业名称/企业ID',
      field: 'enterprise',
      slot: 'enterprise',
      width: 200,
      columnSettingConfig: {
        enabled: true
      }
    },
    {
      title: '版本',
      field: 'version',
      width: 100,
      columnSettingConfig: {
        enabled: true
      }
    },
    {
      title: '零部件数量',
      field: 'partNum',
      width: 100,
      slot: 'partNum',
      columnSettingConfig: {
        enabled: true
      }
    },
    {
      title: '更新人/更新时间',
      field: 'update',
      slot: 'update',
      width: 200,
      columnSettingConfig: {
        enabled: true
      }
    },
    {
      title: '同步状态',
      field: 'status',
      slot: 'statusSlot',
      width: '100',
      columnSettingConfig: {
        enabled: true
      }
    },
    {
      title: '操作',
      field: 'op',
      slot: 'op',
      width: 230,
      fixed: 'right',
      columnSettingConfig: {
        enabled: true,
        type: ColumnSettingTypeEnum.FIXED
      }
    }
  ]

  return {
    searchForm,
    searchOptions,
    tableOptions,
    tableFieldsSetting
  }
}
